/**
 * 人员培训-满意度调查-填写
 */
<template>
    <div class="layout-parent w100 p10">
        <el-tabs type="border-card">
            <el-tab-pane>
                <template #label><vp-label zh="基本信息" en="Basic Info"/></template>
                <SatisfactionSurvey ref="satisfactionSurveyRef" :loading="loading" :type="type" :enableValid="isProcessCompleted"></SatisfactionSurvey>
            </el-tab-pane>
            <el-tab-pane v-if="processInsId">
                <template #label><vp-label zh="流程记录" en="Process Record"/></template>
                <ProcessHistory :processInsId="processInsId" />
            </el-tab-pane>
            <el-tab-pane v-if="processInsId">
                <template #label><vp-label zh="流程图" en="Process Chart"/></template>
                <ProcessView :processInsId="processInsId"/>
            </el-tab-pane>
            <el-tab-pane>
                <template #label><vp-label zh="操作记录" en="Operation Record"/></template>
                <VpOperationRecordCard :id="businessId"></VpOperationRecordCard>
            </el-tab-pane>
        </el-tabs>
        <PageBottom>
            <VpProcessToolBar 
                :process-ins-id="processInsId" 
                :task-id="taskId" 
                :show-reject="false"
                :show-transfer="false"
                :show-delegate="false"
                :loading="submitLoading" 
                :before-show-fn="beforeShowFn"
                :after-agree-fn="afterAgreeFn"
                :set-loading-fn="(_loading: boolean) => { submitLoading = _loading }"
            />
        </PageBottom>
    </div>
</template>
<script setup lang="ts" name="processTrainingSatisfactionSurvey4Eval">
import { ref, reactive, nextTick, onMounted } from 'vue';
import VpOperationRecordCard from '/@/components/vp/operationRecord/VpOperationRecordCard.vue';
import ProcessHistory from '/@/components/vp/workflow/ProcessHistory.vue';
import ProcessView from '/@/components/vp/workflow/ProcessView.vue';
import PageBottom from '/@/components/vp/PageBottom/index.vue';
import request from '/@/utils/request';
import SatisfactionSurvey from './SatisfactionSurvey.vue';
import { ElMessage } from "element-plus";
import { useRoute } from 'vue-router';
import mittBus from '/@/utils/mitt';
import { useUserInfo } from '/@/stores/userInfo';
import VpProcessToolBar from '/@/components/vp/workflow/VpProcessToolBar.vue';

const props = defineProps({
    processInsId: {
        type: String,
        required: true,
    },
    taskId:{
        type: String,
        required: true,
    },
    businessId: {
        type: String,
        required: true,
    },
});

const emits = defineEmits(['formSubmited']);
const loading = ref(false);
const submitLoading = ref(false);
const type = ref('eval');
const formData = ref({
    id: '',
    zt: 10,
    yxbs: 1,
});

const satisfactionSurveyRef = ref();
const route = useRoute();
const isProcessCompleted = ref(true);

onMounted(() => {
    loadForm();
});

// 加载数据
const loadForm = ()=>{
    nextTick(() => {
        loading.value = true;
        const user = useUserInfo().userInfos.user;
        request.get(`/training/teacher/eval/${props.businessId}`).then((res)=>{
            satisfactionSurveyRef.value.setData({
                ...res.data,
            });
            formData.value = res.data;
            loading.value = false;
        })
    });
}

//同意前操作
const beforeShowFn = () => {
    submitLoading.value = true;
    return satisfactionSurveyRef.value.getData().finally(()=>{submitLoading.value = false;});
}
//同意后操作
const afterAgreeFn = (processHandle: any) => { 
    submitLoading.value = true;
    satisfactionSurveyRef.value.getData().then((data: any) =>{
        request.post("/training/teacher/eval/process4Eval", {
            ...data,
            processHandle: {
                processInsId: props.processInsId,
                taskId: props.taskId,
                ...processHandle,
            }
        }).then(()=>{
            mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
            ElMessage.success("办理完毕/Completed Processing");
        }).catch(()=>{
        }).finally(()=>{
            submitLoading.value = false;
        })
    }).catch(()=>{submitLoading.value = false;});
}


</script>
